<template>
  <el-dialog title="添加记录"
             :visible.sync="isAddShow"
             width="70%"
             center
             :close-on-click-modal='false'>
    <el-card>
      <div slot="header"
           class="clearfix">
        <span>添加信息</span>
      </div>
      <el-form :model="form"
               label-width="140px">
        <el-form-item label="记录类型">
          <el-radio-group v-model="form.title"
                          size="medium">
            <el-radio border
                      label="本周工作汇报"></el-radio>
            <el-radio border
                      label="下周工作计划"></el-radio>
            <el-radio border
                      label="问题事项（困难点、问题点、风险点）"></el-radio>
            <el-radio border
                      label="给部门的建议"></el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <el-form :model="form.children"
               v-show="form.title === '本周工作汇报'"
               label-width="140px">
        <!-- 本周工作汇报 -->
        <el-form-item label="执行事项名称">
          <el-input v-model="form.children.name"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="类型">
          <el-radio-group v-model="form.children.type"
                          class="form-item">
            <el-radio-button label="研发"></el-radio-button>
            <el-radio-button label="市场支持"></el-radio-button>
            <el-radio-button label="试点项目"></el-radio-button>
            <el-radio-button label="POC"></el-radio-button>
            <el-radio-button label="售前"></el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="主执行人">
          <el-input v-model="form.children.main_executor"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="其他执行人">
          <el-input v-model="form.children.others_executor"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="本周具体执行内容">
          <el-input v-model="form.children.specific_content"
                    type="textarea"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="备注（补充说明）">
          <el-input v-model="form.children.comment"
                    type="textarea"
                    class="form-item"></el-input>
        </el-form-item>
      </el-form>
      <el-form :model="form.children"
               v-show="form.title === '下周工作计划'"
               label-width="140px">
        <!-- 下周工作计划 -->
        <el-form-item label="执行事项名称">
          <el-input v-model="form.children.name"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="类型">
          <el-radio-group v-model="form.children.type"
                          class="form-item">
            <el-radio-button label="研发"></el-radio-button>
            <el-radio-button label="市场支持"></el-radio-button>
            <el-radio-button label="试点项目"></el-radio-button>
            <el-radio-button label="POC"></el-radio-button>
            <el-radio-button label="售前"></el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="主执行人">
          <el-input v-model="form.children.main_executor"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="其他执行人">
          <el-input v-model="form.children.others_executor"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="下周具体执行内容">
          <el-input v-model="form.children.specific_content"
                    type="textarea"
                    class="form-item"></el-input>
        </el-form-item>
      </el-form>
      <el-form :model="form.children"
               v-show="form.title === '问题事项（困难点、问题点、风险点）'"
               label-width="140px">
        <!-- 问题事项 -->
        <el-form-item label="执行事项名称">
          <el-input v-model="form.children.name"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="严重级别">
          <el-radio-group v-model="form.children.seriousness_level"
                          class="form-item">
            <el-radio-button label="低"></el-radio-button>
            <el-radio-button label="中"></el-radio-button>
            <el-radio-button label="高"></el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="具体描述">
          <el-input v-model="form.children.description"
                    type="textarea"
                    class="form-item"></el-input>
        </el-form-item>
      </el-form>
      <el-form :model="form.children"
               v-show="form.title === '给部门的建议'"
               label-width="140px">
        <!-- 给部门的建议 -->
        <el-form-item label="执行事项名称">
          <el-input v-model="form.children.name"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="提出人">
          <el-input v-model="form.children.raise_people"
                    class="form-item"></el-input>
        </el-form-item>
        <el-form-item label="具体描述">
          <el-input v-model="form.children.description"
                    type="textarea"
                    class="form-item"></el-input>
        </el-form-item>
      </el-form>
      <el-form label-width="140px">
        <el-form-item>
          <el-button type="primary"
                     @click="onSubmit">立即创建</el-button>
          <el-button @click="isAddShow = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </el-dialog>
</template>

<script>
import request from "@/utils/request";

export default {
  name: "add",
  data() {
    return {
      form: {
        title: "本周工作汇报",
        children: {}
      }
    };
  },
  props: {
    option: Object
  },
  computed: {
    isAddShow: {
      get: function() {
        return this.option.isAddShow;
      },
      set: function(newValue) {
        this.option.isAddShow = newValue;
      }
    }
  },
  methods: {
    onSubmit() {
      // 提交
      return request({
        url: "report/add",
        data: {
          year: this.option.year,
          week: this.option.week,
          reportData: this.form
        }
      }).then(result => {
        this.$emit("addsuccess", result);
        this.isAddShow = false;
      });
    }
  }
};
</script>

<style scoped>
.form-item {
  width: 60%;
}
</style>


